<?php require '../public/system/headers/headers.php'; ?>
<?php echo $this->headLink()->appendStylesheet($this->websiteUrl . 'system/css/seotoaster.css'); ?>
<?php echo $this->headLink()->appendStylesheet($this->websiteUrl .'system/js/thickbox/thickbox.css'); ?>
<?php $this->headScript()->appendFile($this->websiteUrl . 'system/js/jquery/jquery.js'); ?>
<?php $this->headScript()->appendFile($this->websiteUrl . 'system/js/thickbox/thickbox.js'); ?>
<?php $this->headScript()->appendFile($this->websiteUrl . 'system/js/shopping/shopping.js'); ?>
<?php echo $this->headScript(); ?>
<script type="text/javascript">window.onload = function(){ var params = { websiteurl : '<?php echo $this->websiteUrl; ?>' }; shop.init(params); <?php if ($this->productId > 0): ?>shop.getDataProductForForm(<?php echo $this->productId; ?>);<?php endif; ?> }</script>
<div id="seotoaster" class="product">
<div class="admineditwhat">{%Add%} / {%Edit%} / {%Remove Products%}</div>
<div class="close_window" onclick="parent.tb_remove();"></div>

<div class="header">
    <div class="addorselectproduct">
        <span style="border-right:1px solid #fff;" onclick="shop.resetFormAddProduct();">{%Add a new product%}</span>
        <span style="border-right:1px solid #fff;" onclick="document.getElementById('prodlist').style.display='block';">{%Edit a product from the list%}</span>
		<input type="hidden" id="producttodel" value='' />
        <span style="float:right;color:#ddd;" onclick="var val=document.getElementById('producttodel').value;if(val > 0){if(confirm('Do you really want to delete this product?')){shop.deleteProduct(val);}}">{%Delete this product%}</span>
    </div>
</div>
	<ul id="prodlist" style='position:absolute;top:57px;z-index:5; display:none; width:780px; min-height:200px;max-height:414px;-moz-border-radius:0px 0px 15px 15px; -webkit-border-radius:0px 0px 15px 15px; padding:20px; overflow:auto;background-color:#fff;border:10px solid #999;border-top:none;'>
		<?php if (is_array($this->products) && count($this->products) > 0): ?>
        <li class="shoproductlisting" style="height:30px;width:720px;font-size:16px;font-weight:bold;">
            Search: <input type="text" name="filterproduct" id="filterproduct" value="" style="color:#7c7c7c;" onfocus="shop.getProducts();" onkeyup="shop.filterProductForProductList(this.value);">
        </li>
			<?php foreach ($this->products as $product) : ?>
			<li class="shoproductlisting" id="<?php echo $product['id']; ?>">
			<a href="#" onclick="shop.getDataProductForForm(<?php echo $product['id'];?>);">
				<span class="shoproductlistingid"><?php echo $product['item_id']; ?></span>
			<img src="<?php echo $this->websiteUrl; ?><?php echo $product['photo']; ?>" alt="<?php echo $product['item_id'];?>" />
			 <span><?php echo (strlen($product['name']) <= 25 ? $product['name'] : substr($product['name'],0,25).'...');?></span></a>
			 </li>
			<?php endforeach; ?> <?php endif; ?>
	 </ul>

<div class="errors" id="message" style="background-color:green;display: none;" onclick="this.style.display='none';"></div>
<div id="list_images"></div>

<div class="body">
    <!--div id="viewpage" style="display: none;">
       <a href="#" target="blank">{%View product page%}</a>
   </div-->
   <a href="#" target="blank">{%View product page%}</a>
    <div class="block1">
    	 <form name="add_product" id="add_product" action="javascript:;" style="margin-bottom:10px">
    	 	<fieldset style="position:relative"><legend>{%Required information%}</legend>
	    <div style="float:left;">
            <select id="image_folders" onchange="shop.loadImages(this.options[this.selectedIndex].value);">
                <option value="" selected="selected">select folder</option>
                <?php if(!empty($this->listFolders) && is_array($this->listFolders)): ?>
                    <?php foreach($this->listFolders as $folderName): ?>
                     <option value="<?php echo trim($folderName); ?>"><?php echo $folderName; ?></option>
                    <?php endforeach; ?>
                <?php endif; ?>
            </select>
            <div id="showimage" align="center"><p>{%No Image%}</p>
			</div>
			
        </div>
      
        <div style="float:left;margin-left:15px;">
            <p>{%Name%}: *<br /><input type="text" name="name" value="" /></p>
            <p>{%Item Id%}: *<br /><input type="text" name="item_id" value="" /></p>
            <p>{%Price%}: *<br /><input type="text" name="price" value="" /></p>
            <p>{%Brand%}: <br /><input type="text" name="brand" autocomplete="off" value="" /></p>
            <ul id="brandsautocomplete" class="listautocomplete brandsautocomplete"></ul>
        </div>
		<div style="clear:both;"></div>
           <p>{%Product Description%}:<textarea name="description" cols="45" rows="5"></textarea>
            <input type="hidden" name="image" value="" />
            <input type="hidden" name="id" value="0" />
        </p>

            <p><a  onclick="shop.addOption();" style="cursor:pointer;" alt="add one more option for this product"><img src="<?php echo $this->websiteUrl; ?>system/images/ico_plus_green.gif" />  {%Add one more options row%} <small>({%Maximum%} 3)</small></a></p>
        <div id="product_options">
          <p><img src="<?php echo $this->websiteUrl; ?>system/images/ico_del_green.gif" alt="delete option"  onclick="this.parentNode.parentNode.removeChild(this.parentNode);" /> <input type="text" /> <input type="text" /></p>
        </div>
    </fieldset></form>
	</div><!-- End Block1 -->

    <div class="block2">
        <fieldset style="position:relative"><legend>{%Related Products%}</legend>
		<div style="position: relative;">
           <form action="javascript:;">
                <p><input type="text" id="autocomplete" name="autocomplete" autocomplete="off" name="search"  style="width:120px;"/> <label> <-- {%Start Typing Name of Product%}</label></p>
                <ul id="listautocomplete" class="listautocomplete"></ul>
           </form>
            <div id="relateds"></div> 
        </div>
		</fieldset>
		 <fieldset style="position:relative"><legend>{%Products Categories%}</legend>
        <div>
            <form action="javascript:;">
                <p><input type="text" name="addgroup" />
                    <input type="button" value="{%Add%}" onclick="shop.addGroup(this.form.addgroup.value);this.form.addgroup.value ='';" /></p>
            </form>
            <div id="groups">
                <?php if(is_array($this->groups) && count($this->groups) > 0): ?>
                <?php foreach ($this->groups as $group): ?>
                <p id="<?php echo 'group-'.$group['id']; ?>"><input type="checkbox" />
                 <img title="delete <?php echo $group['name']; ?>" onclick="if(confirm('You want delete this group?')){shop.deleteGroup('<?php echo $group['id']; ?>');}" src="<?php echo $this->websiteUrl; ?>system/images/ico_delete.gif" />
                 <span title="<?php echo $group['name']; ?>" ondblclick="shop.editGroup(this);"><?php echo (substr($group['name'],0,11)); ?></span></p>
                <?php endforeach; ?>
                <?php endif; ?>
            </div>
        </div>
		</fieldset>
            
    </div>
    
</div>
<input type="button" class="formsubmit" id="submitform" value="{%Done%}" onclick="shop.addProduct();" />
</div>
